<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="./css/test.css">
	<link rel="stylesheet" href="./css/normalize.css">
	<link rel="stylesheet" href="./css/luo.css">
</head>
<body>
	<div class="box">
		<header class="header">
		   <div class="header__wrap">
				<a class="header__logo">品牌手机</a>
				<nav class="header__nav">
					<a href="javascript:;" class="header__nav-item header__nav-item-1">首页</a>
					<a href="javascript:;" class="header__nav-item header__nav-item-2">外观</a>
					<a href="javascript:;" class="header__nav-item header__nav-item-3">配置</a>
					<a href="javascript:;" class="header__nav-item header__nav-item-4">型号</a>
					<a href="javascript:;" class="header__nav-item header__nav-item-5">说明</a>
					
					<a href="javascript:;" class="header__nav-item header__nav-item_custom_button">立即购买</a>
					<div class="header__nav-item_tip"></div>
				</nav>
		   </div>	
		</header>
		<div class="screen-1">
			<h2 class="screen-1__heading"><b>持续领航</b> 你的不二选择</h2>
			<div class="screen-1__phone"></div>
			<div class="screen-1__shadow"></div>
		</div>
		<div class="screen-2">
			<h2 class="screen-2__heading">优美的设计，更令人着迷</h2>
			<h3 class="screen-2__subheading">
			采用受欢迎的设计，让它更加出色。
			<br> 
			款式小巧、轻便手感更舒适。绚丽高清的显示屏，整个外观显得格外精致
			</h3>
			<div class="screen-2__phone">
				<div class="screen-2__point screen-2__point_1">高清摄像</div>
				<div class="screen-2__point screen-2__point__custom_left screen-2__point_2">超薄机身</div>
				<div class="screen-2__point screen-2__point__custom_left screen-2__point_3">大屏显示</div>
			</div>
		</div>
		<div class="screen-3">
			<div class="screen-3__wrap">
				<h2 class="screen-3__heading">外形小巧，功能强大的手机</h2>
				<h3 class="screen-3__subheading">采用受欢迎的设计，让它更加出色。 
				<br>
款式小巧、轻便手感更舒适。绚丽高清的显示屏，整个外观显得格外精致。</h3>
				<div class="screen-3__phone"></div>
				<div class="screen-3__features">
					<div class="screen-3__features__item">
						<div class="screen-3__features__item__number">5.7</div>
						<div class="screen-3__features__item__desc">大英寸</div>
					</div>
					<div class="screen-3__features__item">
						<div class="screen-3__features__item__number">1200</div>
						<div class="screen-3__features__item__desc">万像素</div>
					</div>
					<div class="screen-3__features__item">
						<div class="screen-3__features__item__number">3D</div>
						<div class="screen-3__features__item__desc">touch</div>
					</div>
					<div class="screen-3__features__item">
						<div class="screen-3__features__item__number">A9</div>
						<div class="screen-3__features__item__desc">处理器</div>
					</div>
				</div>
			</div>
		</div>
		<div class="screen-4">
			<div class="screen-4__wrap">
				<h2 class="screen-4__heading">缤纷色彩</h2>
				<h3 class="screen-4__subheading">总有你心仪的</h3>
				<div class="screen4__type">
					<div class="screen4__type__item screen4__type__item_1">
						<h3 class="screen4__type__item__color">玫瑰红</h3>
						<h4 class="screen4__type__item__storage">16/32/64G</h4>
					</div>
					<div class="screen4__type__item screen4__type__item_2">
						<h3 class="screen4__type__item__color">樱花粉</h3>
						<h4 class="screen4__type__item__storage">16/32/64G</h4>
					</div>
					<div class="screen4__type__item screen4__type__item_3">
						<h3 class="screen4__type__item__color">太空灰</h3>
						<h4 class="screen4__type__item__storage">16/32/64G</h4>
					</div>
					<div class="screen4__type__item screen4__type__item_4">
						<h3 class="screen4__type__item__color">绅士黑</h3>
						<h4 class="screen4__type__item__storage">16/32/64G</h4>
					</div>
				</div>
			</div>
		</div>
		<div class="screen-5">
			<h2 class="screen-5__heading">游戏、学习、拍照、有这一部就够了</h2>
			<h3 class="screen-5__subheading">看视频、拍摄高清视频与照片、视频聊天、一机多功能，让您生活更丰富精彩</h3>
			<div class="screen-5__bg">

			</div>
		</div>
		<div class="buy">
			<a href="#" class="buy__button">立即购买</a>
		</div>
	</div>
	<footer class="footer">© 2018 imooc.com  京ICP备13046642号</footer>
	<div class="outline">
		<a href="javascript:;" class="outline__item">首页</a>
		<a href="javascript:;" class="outline__item">外观</a>
		<a href="javascript:;" class="outline__item">配置</a>
		<a href="javascript:;" class="outline__item">型号</a>
		<a href="javascript:;" class="outline__item">说明</a>
	</div>
	<!-- <script src="js/luo.js"></script> -->
	<script src="js/jin.js"></script>
</body>
</html>